<!DOCTYPE HTML>
<html data-layout-decorate="~{layout/default}"
>
<head>
    <title>Login</title>
    <!--http://open.weibo.com/wiki/Connect/login-->
    <!--http://open.weibo.com/widget/loginbutton.php-->
</head>
<body>
<div class="section container" data-layout-fragment="content">
    <div id="errorMessage" class="card-panel red lighten-2" data-th-if="${param.error}">
        <span class="card-title">Invalid user name or password</span>
    </div>
    <div class="col s12 z-depth-4 card-panel">
        <form id="login"
              class="login-form"
              data-th-action="@{/api/v1/login}"
              method="post">
            <div class="row">
                <div class="input-field col s12 center">
                    <p class="center login-form-text"></p>
                    <h2 class="circle responsive-img valign profile-image-login header center orange-text">Login</h2>
                </div>
            </div>
            <div class="row margin">
                <div class="input-field col s12">
                    <i class="mdi-social-person-outline prefix"></i>
                    <input id="username" name="username" type="text" class="validate"/>
                    <label for="username" class="center-align">Username</label>
                </div>
            </div>
            <div class="row margin">
                <div class="input-field col s12">
                    <i class="mdi-action-lock-outline prefix"></i>
                    <input id="password" name="password" type="password" class="validate"/>
                    <label for="password">Password</label>
                </div>
            </div>
            <div class="row">
                <div class="input-field col s12 m12 l12  login-text">
                    <input type="checkbox" id="remember-me"/>
                    <label for="remember-me">Remember me</label>
                </div>
            </div>


            <div class="form-group">
                <div class="row center">
                    <button type="submit" class="btn indigo waves-effect waves-light">
                        <i class="mdi-content-send right ">Login</i>
                    </button>

                    <a data-th-href="@{/login/qq}"
                       class="btn indigo waves-effect waves-light"><i class="mdi-content-send right ">QQ登录</i></a>
                    <a data-th-href="@{/login/sina}"
                       class="btn indigo waves-effect waves-light"><i class="mdi-content-send right ">微博登录</i></a>
                    <a data-th-href="@{/login/github}"
                       class="btn indigo waves-effect waves-light"><i class="mdi-content-send right ">GitHub登录</i></a>
                </div>
            </div>

            <div class="row">
                <div class="input-field col s6 m6 l6">
                    <p class="margin medium-small"><a href="#">Register Now!</a></p>
                </div>
                <div class="input-field col s6 m6 l6">
                    <p class="margin right-align medium-small"><a href="#">Forgot password ?</a>
                    </p>
                </div>
            </div>
        </form>

    </div>
    <div id="footerbar" class="row center">
        Copyright ©2017<a href="https://chaojihao.net">58TODO</a>保留所有权利<a href="http://www.miitbeian.gov.cn"
                                                                          target="_blank">豫ICP备16006862号-2</a>
    </div>
</div>
</body>
</html>
